<template>
  <el-descriptions :column="2" class="descriptions">
    <template #title>
      <el-alert
        :title="obj.taskStatusTypeEntity.statusName"
        type="info"
        show-icon
        :closable="false"
      />
      <div id="img" />
    </template>
    <el-descriptions-item label="设备编号">{{ obj.innerCode }}</el-descriptions-item>
    <el-descriptions-item label="创建日期">{{ obj.createTime.replace('T','  ') }}</el-descriptions-item>
    <el-descriptions-item label="取消日期">{{ obj.updateTime }}</el-descriptions-item>
    <el-descriptions-item label="运营人员">{{ obj.userName }}</el-descriptions-item>
    <el-descriptions-item label="工单类型">{{ obj.typeName }}</el-descriptions-item>
    <el-descriptions-item label="补货数量">
      <el-button id="bhxq" type="text" @click="infoFn">补货详情</el-button>
    </el-descriptions-item>
    <el-descriptions-item label="工单方式">{{ obj.createType }}</el-descriptions-item>
    <el-descriptions-item label="取消原因">{{ obj.desc }}</el-descriptions-item>
  </el-descriptions>
</template>

<script>
import { getAddTask } from '@/api' // getTaskDetails
import imgSrc from '../../../assets/xxts.png'
export default {
  props: {
    obj: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      img: imgSrc
    }
  },
  methods: {
    async infoFn() {
      // 查看补货的情况
      const { data } = await getAddTask(this.obj.taskId)
      // console.log(data)
      this.$emit('infoFn', data)
    }
  }
}
</script>

<style lang="scss" >
.descriptions {
  margin-left: 30px;
}
#bhxq {
  padding: 0;
  margin: 0;
  font-size: 14px;
  height: 21px;
  // line-height: 21px;
  span {
    height: 21px;
  }
}
.el-descriptions__title {
  width: 100%;
  height: 70px;
}
.el-alert--info.is-light {
  height: 50px;
  color: #333;
  .el-alert__icon {
    font-size: 22px;
  }
  span{
    color: #999;
    margin-left: 14px;
    font-size: 14px;
  }
}
#img {
  background-image: url(../../../assets/xxts.png);
  position: relative;
  z-index: 99;
  top: -60px;
  right: -500px;
  width: 88px;
  height: 68px;
}
</style>
